<template>
    <div>
        <div>默认情况下，组件上的 v-model 使用 modelValue 作为 prop 和 update:modelValue 作为事件。</div>
        <my-comp v-model="msg" />
    </div>
    <h2>多个v-model 绑定</h2>
    <user-name v-model:first-name="firstName" v-model:last-name="lastName" />
</template>

<script>
import MyComp from './MyComp.vue'
import UserName from './UserName.vue'
import { ref, reactive, toRefs } from 'vue'

export default {
    components: {
        MyComp,
        UserName
    },
    setup () {
        const msg = ref('默认msg值')
        return {
            msg,
            ...toRefs(reactive({firstName: 'jiang', lastName: 'xuemei'}))
        }
    }
}
</script>

<style lang="scss" scoped>

</style>